.text-nowrap {
    // 省略
    white-space: nowrap;
    /*文本不换行*/
    text-overflow: ellipsis;
    /*设置超出部分显示...*/
    overflow: hidden;
    word-break: break-all;
}

// 网格布局
.index-page {
    width: 100%;
    min-width: 1100px;
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 15px 15px;

    .index-grid {
        /* 网格 */
        height: 100%;
        width: 100%;
        display: grid;
        grid-template-columns: 280px calc(50% - 150px) calc(50% - 150px);
        grid-template-rows: 100%;
        // 间隔
        grid-gap: 10px;

        .business-detail {
            margin-bottom: -11px;
            height: 100%;
        }

        .detail-and-map {
            height: 100%;
            overflow: hidden;
            display: flex;
            flex-direction: column;

            .business-detail {
                flex: 1;
            }

            .map-red-line {
                height: 50%;
                width: 100%;
            }

        }

        .card-aside {
            // grid-row-start: span 2;
        }

        .card {
            border-radius: 0;
            border: 0px solid #ebeef500;
        }

        .card-main {
            position: relative;
        }
    }
}


// 左侧 生命周期
.cycle-content {
    height: 100%;
    display: flex;
    flex-direction: column;

    // 项目名称
    .project-Name {
        cursor: pointer;
        padding: 5px 0;
        background-color: rgb(224 224 224 / 21%);
        border-radius: 5px;
        color: rgb(32 104 135);
        font-weight: bold;
        font-size: 15px;
        margin-bottom: 7px;


        span {
            padding-left: 6px;
        }

        &:hover {
            background-color: rgb(224 224 224 / 41%);
        }
    }

    // 阶段名称
    .fullCycle-name {
        padding-left: 10px;
        color: rgb(4 119 169);
        font-weight: bold;
    }

    // 业务名称
    .fullCycle-busin {
        padding: 3px 0 3px 10px;
        color: #c5c5c5;



        &.effect {
            cursor: pointer;
            color: #000000;

            &:hover,
            &:active,
            &:visited {
                background-color: #e0e0e09f;
                border-radius: 5px;
                color: #32a6c9;
            }
        }
    }

    .active {
        color: #32a6c9;
    }

    .fullCycle {
        display: flex;
        flex-direction: column;
        padding: 5px 0 5px 17px;
        position: relative;

        &::before {
            content: "";
            width: 2px;
            height: 98%;
            position: absolute;
            background: rgba(50, 166, 201, 0.7803921569);
            left: 13px;
            top: 9px;
        }

        &:last-child:before {
            display: none;
        }

        .cycle {
            left: 7px;
            top: 9px;
            position: absolute;
            display: inline-block;
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background-color: #2abb82; //默认颜色 未生成
        }

        .cycle-icon {
            border: 1px solid #2abb82;

            background-color: rgba(255, 255, 255);

        }

    }
}


// 中间
// 业务详情
.detail-cardmain {
    // border: 6px solid #ffffff85;
    padding: 12px;
    height: 100%;
    overflow-y: auto;
}

.detail-header {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
}

// 地块红线
.map {
    // width: 600px;
    // height: 250px;
    width: 100%;
    height: 100%;
}



// 右侧 电子档案
.file-project {
    height: 100%;
    // overflow-y: auto;
    display: flex;
    flex-direction: column;
}

::v-deep {

    .el-card.card {
        margin-bottom: 0px;

        .el-card__body {
            padding: 10px;
            overflow-y: auto;
            height: calc(100% - 40px);

        }
    }

    .el-card__header {
        font-weight: 600;
        position: relative;

        &::before {
            content: '';
            width: 3px;
            height: calc(100% - 22px);
            position: absolute;
            left: 8px;
            top: 11px;
            background: #39f;
        }
    }

    ::-webkit-scrollbar {
        width: 2px;
        background-color: #f1f1f1;
        position: absolute;
        right: 0;
    }

    ::-webkit-scrollbar-thumb {
        background-color: #5959595c;
        border-radius: 8px;
        padding-right: 10px;
    }
}

.dividingLine {
    .el-divider__text {
        color: #4ca6ff;
        cursor: pointer;
    }
}